<template>
    <div class="home-like">
        <div class="like-title">
            <img src="@/assets/images/home/like/heart.png" alt="">
            猜你喜欢
        </div>
        <ul>
            <li class="like-item clearfix" v-for="item in likeList" :key="item.id">
                <div class="like-img">
                    <img :src="item.imgUrl" alt="">
                </div>
                <div class="like-text">
                    <p class="like-text-title">{{item.title}}</p>
                    <p class="like-message">{{item.message}}条评论</p>
                    <div class="like-map">
                        <span class="mark">￥{{item.price}}</span> 起
                        <span class="position">{{item.map}}</span>
                    </div>
                </div>
            </li>
        </ul>
    </div>
</template>

<script>
export default {
    name : "home-like",
    data(){
        return{
            
        }
    },
    props : [
        "likeList"
    ]
}
</script>

<style scoped lang="stylus">

.home-like{ padding: 0 0.2rem;}

.home-like .like-title{ padding:0.2rem 0rem; font-size:0.3rem; color:#212121; font-weight:bold;}

.home-like .like-title img{ width:0.3rem; height:0.3rem;}

.like-item{ position: relative; padding:0.2rem 0rem; border-bottom:0.01rem solid #e0e0e0; }

.like-img{ float:left;}

.like-img img{ width:2rem; height 2rem;}

.like-text{ float:left; padding-left : 0.2rem;}

.like-text-title{ margin-top:0.3rem; color:#212121; font-size:0.32rem; font-weight:bold;}

.like-message{ margin-top:0.3rem; font-size:0.24rem; color:#616161;}

.like-map{ margin-top:0.3rem; color:#616161; font-size:0.24rem;}

.like-map .mark{ font-size:0.36rem; font-weight: bold; color:#ff8300;}

.like-map .position{ position:absolute; right:0;}

</style>


